<template>
  <div class="app-container employeePiece">
    <FixedBar>
      <el-button v-if="handleType !== 'view'" type="primary" @click="onSubmit">提交审核</el-button>
      <el-button @click="onCancel">取消</el-button>
    </FixedBar>
    <el-card class="mt10 box-card" v-if="handleType !== 'add'">
      <StatusSteps v-if="order" :active="order.taskNode" :status="order.status"></StatusSteps>
    </el-card>

    <el-form :model="pieceForm" :rules="rules" ref="pieceForm" label-width="auto" size="mini" :disabled="handleType === 'view'">
      <el-card class="mt10 box-card">
        <div slot="header" class="clearfix">
          <span>业务信息</span>
          <el-tooltip placement="top" class="ml5">
            <div slot="content">
              预估业务量：预测24h量-预测12h量+省内未发+班组遗留<br/>
              建议人数：当班预测量 / 对应运营方案设置的人效<br/>
              预估用工（业务）：人员配置中“实际人数”的汇总值<br/>
              预估用工（人事）：排班人数 + 零工人数<br/>
              预估人效（人事）：当班预测量 / 人事预估用工数<br/>
              预估用工超额：（人事预估用工数 - 建议人数）/建议人数*100%
            </div>
            <el-link icon="el-icon-question"></el-link>
          </el-tooltip>
        </div>
        <el-row :gutter="10">
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="需求单号" prop="operationalOrderCode">
              <el-input v-model="pieceForm.operationalOrderCode" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="用工日期" prop="workTime">
              <el-date-picker type="date" format="yyyy-MM-dd" placeholder="选择日期" :picker-options="pickerOptions" v-model="pieceForm.workTime" style="width: 100%;"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="班次" prop="timeShiftId">
              <el-select ref="selectValue1" v-model="pieceForm.timeShiftId" filterable placeholder="请选择"  >
                <el-option
                  v-for="item in timeShiftList"
                  :key="item.timeShiftId"
                  :label="item.timeShiftName"
                  :value="item.timeShiftId"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="预测24h" prop="forecast24">
              <el-input type="number" style="width: 100%" v-model="pieceForm.forecast24" min="0">
                <template slot="append">万件</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="预测12h" prop="forecast12">
              <el-input style="width: 100%" v-model="pieceForm.forecast12" :min="0">
                <template slot="append">万件</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="省内未发" prop="notSentNumber">
              <el-input style="width: 100%" v-model="pieceForm.notSentNumber" :min="0">
                <template slot="append">万件</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="待卸量" prop="quantityToUnloaded">
              <el-input style="width: 100%" v-model="pieceForm.quantityToUnloaded" :min="0">
                <template slot="append">万件</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="车辆数" prop="carNumber">
              <el-input style="width: 100%" v-model.number="pieceForm.carNumber" :min="0">
                <template slot="append">辆</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="班组遗留" prop="bequeathNumber">
              <el-input style="width: 100%" v-model="pieceForm.bequeathNumber" :min="0">
                <template slot="append">万件</template>
              </el-input>
            </el-form-item>
          </el-col>
<!--          <el-col :xs="24" :sm="12" :md="8" :lg="6">-->
<!--            <el-form-item label="预估业务量" prop="estimateBusinessNumber">-->
<!--              <el-input style="width: 100%" v-model.number="pieceForm.estimateBusinessNumber" :disabled="true">-->
<!--                <template slot="append">件</template>-->
<!--              </el-input>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
          <el-col :xs="24" :sm="12" :md="8" :lg="6">
            <el-form-item label="预估业务量" prop="estimateBusinessNumber">
              <el-input style="width: 100%" v-model="estimateBusinessNumber" :disabled="true">
                <template slot="append">万件</template>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-card>
    </el-form>
  </div>
</template>

<script>
  import { getOrderCode, operationalAdd, operationalUpdate, getOperationalDetail } from "@/api/plan/employee";
  import FixedBar from '@/components/FixedBar';
  import { getTimShiftInfo } from "@/api/job/scheme";
  import { parseTime } from "@/utils/ruoyi";
  import StatusSteps from "../components/statusSteps"
  export default {
    name: "employeeAdd",
    components:{
      FixedBar,
      StatusSteps
    },
    created() {
      //获取初始化配置
      // this.getEquipmentsAndDeps();
      // console.log(this.id,this.handleType)
      if(this.handleType === 'add'){
        //获取需求单号
        this.getOrderCode()
      }else {
        //获取订单详情
        this.getOperationalDetail(this.id)
      }

      //获取班次
      this.getTimShiftInfo();
    },
    props:{
      handleType: {   //操作类型
        default: 'add',
        type: String
      },
      id: {
        type: [Number,String],
        default: null
      }

    },
    data() {
      const positiveNumber = (rule, value, callback) => {
        if(Number(value) >= 0){
          callback();
        }else{
          callback(new Error("请输入有效数值"));
        }
      };
      return {
        timeShiftList: null,
        order: null,  //订单数据
        pieceForm: {
          operationalOrderCode: null,
          workTime: new Date().getTime()+24*60*60*1000,
          timeShiftId: null,
          forecast24: null,
          forecast12: null,
          notSentNumber: null,
          quantityToUnloaded: null,
          carNumber: null,
          bequeathNumber: null,
          estimateBusinessNumber: null,
        },
        rules: {
          operationalOrderCode: [
            { required: true, trigger: 'blur' },
          ],
          workTime: [
            { required: true, message: '请选择', trigger: 'change' },
          ],
          standardEffect: [
            { required: true, message: '请输入标准人效', trigger: 'blur' },
            { type: 'number', message: '标准人效必须为数字值'}
          ],
          timeShiftId: [
            { required: true, message: '请选择', trigger: 'change' },
          ],
          forecast24: [
            { required: true, message: '请输入', trigger: 'blur' },
            { validator: positiveNumber, trigger: 'blur' },
          ],
          forecast12: [
            { required: true, message: '请输入', trigger: 'blur' },
            { validator: positiveNumber, trigger: 'blur' },
          ],
          notSentNumber: [
            { required: true, message: '请输入', trigger: 'blur' },
            { validator: positiveNumber, trigger: 'blur' },
          ],
          quantityToUnloaded: [
            { required: true, message: '请输入', trigger: 'blur' },
            { validator: positiveNumber, trigger: 'blur' },
          ],
          carNumber: [
            { required: true, message: '请输入', trigger: 'blur' },
            { validator: positiveNumber, trigger: 'blur' },
          ],
          bequeathNumber: [
            { required: true, message: '请输入', trigger: 'blur' },
            { validator: positiveNumber, trigger: 'blur' },
          ],
        },
        //禁用时间
        pickerOptions: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 8.64e7;
          }
        },
      };
    },
    computed: {
      estimateBusinessNumber: function () {
        const { forecast24, forecast12, notSentNumber, bequeathNumber } = this.pieceForm;
        const estimateBusinessNumber = forecast24*1 - forecast12*1 + notSentNumber*1 + bequeathNumber*1;
        // this.pieceForm = { ...this.pieceForm, estimateBusinessNumber: estimateBusinessNumber}
        return estimateBusinessNumber.toFixed(2)
      }
    },

    methods: {
      //新增
      operationalAdd(params){
        operationalAdd(params).then(res=>{
          // console.log(res)
          if(res && res.code === 200){
            this.$router.replace({path:"/plan/employee"});
          }
        })
      },
      //编辑
      operationalUpdate(params){
        operationalUpdate(params).then(res=>{
          // console.log(res)
          if(res && res.code === 200){
            this.$router.replace({path:"/plan/employee"});
          }
        })
      },

      //取消
      onCancel(){
        this.$router.replace({path:"/plan/employee"});
      },
      //保存
      onSubmit: function(){
        this.$refs["pieceForm"].validate(valid => {
          if (valid) {
            const { timeShiftId, workTime } = this.pieceForm;
            //获取班次名称
            let timeShiftName = null;
            this.timeShiftList.forEach(item=>{
              if(item.timeShiftId === timeShiftId){
                timeShiftName = item.timeShiftName;
              }
            });
            const workTimeFormat = parseTime(workTime,'{y}-{m}-{d}')
            //获取预估业务量
            let params = { ...this.pieceForm, workTime: workTimeFormat, timeShiftName,estimateBusinessNumber:this.estimateBusinessNumber*1};
            // console.log(params);

            const { id , taskNode , status, operationalOrderCode  } = this.order || {}
            if(id){
              params = { ...params, id, taskNode, status, orderCode:operationalOrderCode };
              // console.log(params);
              this.operationalUpdate(params)
            }else {
              this.operationalAdd(params);
            }



          }
        })
      },
      //订单详情
      getOperationalDetail(id){
        getOperationalDetail(id).then(res=>{
          // console.log(res);
          if(res && res.code === 200){
            const data = res.data || {};
            this.order = data;
            //编辑和详情 回写数据
            this.pieceForm = {
              ...this.pieceForm,
              operationalOrderCode: data.operationalOrderCode,
              workTime: data.workTime,
              timeShiftId: data.timeShiftId,
              forecast24: data.forecast24,
              forecast12: data.forecast12,
              notSentNumber: data.notSentNumber,
              bequeathNumber: data.bequeathNumber,
              quantityToUnloaded: data.quantityToUnloaded,
              carNumber: data.carNumber,
              estimateBusinessNumber: data.estimateBusinessNumber,
            }
          }
        })
      },
      //需求单号获取
      getOrderCode(){
        getOrderCode().then(res=>{
          // console.log(res);
          if(res && res.code === 200){
            this.pieceForm = {
              ...this.pieceForm,
              operationalOrderCode: res.msg
            }
          }
        })
      },
      //班次获取
      getTimShiftInfo(){
        getTimShiftInfo().then(res=>{
          if(res && res.code === 200){
            this.timeShiftList= res.rows;
          }
        });
      },
    },


  };
</script>

